<template>
  <div class="home-head">
    <van-icon @click="$router.push('/cate')" class-prefix="icon" name="fenlei" />
    <div class="seach" @click="$router.push('/rearch')">
    <van-icon class-prefix="icon" name="sousuo"  />
    <span>搜索商品</span>
    </div>
    <van-icon class-prefix="icon" name="kefu" />
  </div>
</template>

<script>
export default {

}
</script>

<style lang="scss" scoped>
.home-head{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 50px;
  display: flex;
  align-items: center;
  z-index: 100;
  background-color: #fff;
  .icon{
    font-size: 22px;
  }
  .fenlei{
    margin: 0 5px;
  }
  .seach{
    flex: 1;
    height: 30px;
    border: 1px solid #ccc;
    border-radius: 16px;
    font-size: 14px;
    color: #333;
    display: flex;
    align-items: center;
    .van-icon{
      margin: 0 5px;
    }
  }
  .kefu{
    margin: 0 5px;
  }
}
</style>
